import { StyleSheet } from 'react-native';
import { autoSize } from "./common";
import { NAVBAR_HEIFHT, SCREEN_HEIGHT, SCREEN_WIDTH } from "../../constant";
import Colors from "./Colors";
export const archiveProps = {
    navProps: {}
};
export const archiveStyles = StyleSheet.create({
    navBar: {
        height: NAVBAR_HEIFHT,
        width: SCREEN_WIDTH,
        position: 'absolute',
        top: 0,
        left: 0,
        zIndex: 100,
        backgroundColor: '#000',
        display: 'flex',
        alignItems: 'center',
        justifyContent: 'center',
    },
    navBarTitle: {
        marginTop: 10,
        color: '#fff'
    },
    nextStep: {
        position: 'absolute',
        top: NAVBAR_HEIFHT * 0.35,
        right: 20,
    },
    back: {
        position: 'absolute',
        top: NAVBAR_HEIFHT * 0.4,
        left: 20,
    },
    block: {
        width: SCREEN_WIDTH,
        height: 100,
        backgroundColor: '#f00'
    },
    container: {
        position: 'relative'
    },
    scrollViewContentView: {
        height: SCREEN_HEIGHT,
        display: 'flex',
        flex: 1,
        position: 'absolute',
        left: 0,
        top: 0,
        zIndex: -1
    },
    headerView: {
        width: SCREEN_WIDTH,
        height: autoSize(297),
        backgroundColor: 'rgb(233,123,36)',
        paddingTop: NAVBAR_HEIFHT,
        position: 'relative',
        display: 'flex',
        justifyContent: 'center',
        alignItems: 'flex-end'
    },
    avatarContainer: {
        position: 'absolute',
        bottom: 10,
        left: SCREEN_WIDTH * 0.5 - autoSize(85),
        zIndex: 2
    },
    avatar: {
        width: autoSize(170),
        height: autoSize(170),
        borderWidth: 5,
        borderColor: '#fff',
        borderRadius: autoSize(85),
        display: 'flex',
        flex: 1,
        backgroundColor: '#E0E0E0',
        justifyContent: 'center',
        alignItems: 'center',
    },
    avatarImage: {
        width: autoSize(170),
        height: autoSize(170),
        borderRadius: autoSize(85),
        borderWidth: 5,
        borderColor: '#fff',
    },
    headerBottom: {
        position: 'absolute',
        left: 0,
        bottom: 0,
        backgroundColor: '#fff',
        height: autoSize(91),
        width: SCREEN_WIDTH,
        zIndex: 1
    },
});
export const areaPickStyles = StyleSheet.create({
    container: {
        backgroundColor: '#232728'
    }
});
export const focusStyles = StyleSheet.create({
    listItem: {
        height: autoSize(140),
        flexDirection: 'row',
        display: 'flex',
        alignItems: 'center',
        justifyContent: 'space-between',
        backgroundColor: '#fff',
        paddingHorizontal: autoSize(15)
    },
    listItemNameText: {
        color: '#333',
        fontSize: 15,
        marginBottom: 5,
        marginLeft: 10,
    },
    listItemAddressText: {
        color: '#666',
        fontSize: 13,
        marginLeft: 10,
    },
    listItemFocusStatus: {
        display: 'flex',
        alignItems: 'center',
        justifyContent: 'center',
        width: autoSize(40),
        height: autoSize(40),
        borderRadius: autoSize(20),
        borderWidth: 2,
        borderColor: Colors.Active
    },
    listItemUnFocusStatus: {
        display: 'flex',
        alignItems: 'center',
        justifyContent: 'center',
        width: autoSize(40),
        height: autoSize(40),
        borderRadius: autoSize(20),
        borderWidth: 2,
        borderColor: '#ccc'
    },
    container: {}
});
